.label {
  padding: 6px 16px;
  text-transform: capitalize;
  background-color: light-dark(
    alpha(var(--mantine-color-gray-9), 0.06),
    alpha(var(--mantine-color-gray-3), 0.06)
  );
}

.labelActive {
  background-color: transparent;
  color: var(--mantine-color-dark-9);
}

.labelActive:hover {
  color: var(--mantine-color-dark-9);
}

.active {
  background-color: var(--mantine-color-white);
}

.root {
  background-color: transparent;
  gap: 8px;
  
  @container (max-width: theme('screens.sm')) {
    overflow: auto hidden;
    max-width: 100%;
  }
}


.control {
  border: none !important;
}

.filtersWrapper {
  @container (max-width: theme('screens.sm')) {
    width: 100%;
  }

  > * {
    flex-grow: 1;
  }
}
